<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="css/normalize.css">
    <link href="https://cdn.bootcss.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="css/style.css">
    <title>入职申请</title>
</head>

<body>
    <main class="main">
        <form id="entryform" method="POST">
            <section class="container container-fluid base-info">
                <div class="header">员工信息</div>
                <div class="row">
                    <div class="col col-lg-10">
                        <div class="row">
                            <div class="col">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <label for="username" class="input-group-text">*姓名</label>
                                        <input class="form-control form-control-sm" type="text" name="employee_name" id="username">
                                    </div>
                                </div>
                            </div>
                            <div class="col">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <label for="" class="input-group-text">*性别</label>
                                    </div>
                                    <select class="form-control form-control-sm" name="gender" id="">
                                        <option value="1">男</option>
                                        <option value="0">女</option>
                                    </select>
                                </div>

                            </div>
                            <div class="col col-lg-4">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <label for="" class="input-group-text">*民族</label>
                                    </div>
                                    <select class="form-control form-control-sm" name="national">
                                        <option value="汉族">汉族</option>
                                        <option value="回族">回族</option>
                                        <option value="苗族">苗族</option>
                                        <option value="蒙古族">蒙古族</option>
                                        <option value="藏族">藏族</option>
                                        <option value="维吾尔族">维吾尔族</option>
                                        <option value="彝族">彝族</option>
                                        <option value="壮族">壮族</option>
                                        <option value="布依族">布依族</option>
                                        <option value="朝鲜族">朝鲜族</option>
                                        <option value="满族">满族</option>
                                        <option value="侗族">侗族</option>
                                        <option value="瑶族">瑶族</option>
                                        <option value="白族">白族</option>
                                        <option value="土家族">土家族</option>
                                        <option value="哈尼族">哈尼族</option>
                                        <option value="哈萨克族">哈萨克族</option>
                                        <option value="傣族">傣族</option>
                                        <option value="黎族">黎族</option>
                                        <option value="僳族">僳族</option>
                                        <option value="佤族">佤族</option>
                                        <option value="畲族">畲族</option>
                                        <option value="高山族">高山族</option>
                                        <option value="拉祜族">拉祜族</option>
                                        <option value="水族">水族</option>
                                        <option value="东乡族">东乡族</option>
                                        <option value="纳西族">纳西族</option>
                                        <option value="景颇族">景颇族</option>
                                        <option value="柯尔克孜族">柯尔克孜族</option>
                                        <option value="土族">土族</option>
                                        <option value="达斡尔族">达斡尔族</option>
                                        <option value="仫佬族">仫佬族</option>
                                        <option value="羌族">羌族</option>
                                        <option value="布朗族">布朗族</option>
                                        <option value="撒拉族">撒拉族</option>
                                        <option value="毛南族">毛南族</option>
                                        <option value="仡佬族">仡佬族</option>
                                        <option value="锡伯族">锡伯族</option>
                                        <option value="阿昌族">阿昌族</option>
                                        <option value="普米族">普米族</option>
                                        <option value="塔吉克族">塔吉克族</option>
                                        <option value="怒族">怒族</option>
                                        <option value="乌孜别克族">乌孜别克族</option>
                                        <option value="俄罗斯族">俄罗斯族</option>
                                        <option value="鄂温克族">鄂温克族</option>
                                        <option value="德昂族">德昂族</option>
                                        <option value="保安族">保安族</option>
                                        <option value="裕固族">裕固族</option>
                                        <option value="京族">京族</option>
                                        <option value="塔塔尔族">塔塔尔族</option>
                                        <option value="独龙族">独龙族</option>
                                        <option value="鄂伦春族">鄂伦春族</option>
                                        <option value="赫哲族">赫哲族</option>
                                        <option value="门巴族">门巴族</option>
                                        <option value="珞巴族">珞巴族</option>
                                        <option value="基诺族">基诺族</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <label for="" class="input-group-text">*政治面貌</label>
                                    </div>
                                    <select class="form-control" name="political" id="">
                                        <option value="党员">党员</option>
                                        <option value="团员">团员</option>
                                        <option value="群众">群众</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <label class="input-group-text" for="">*籍贯</label>
                                        <input class="form-control form-control-sm" type="text" name="native_place" id="" placeholder="" required>
                                    </div>
                                </div>
                            </div>
                            <div class="col">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <label class="input-group-text" for="">*户籍</label>
                                        <input class="form-control form-control-sm" type="text" name="census" id="" placeholder="" required>
                                    </div>
                                </div>
                            </div>
                            <div class="col col-lg-4">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <label class="input-group-text" for="">*户籍类型</label>
                                    </div>
                                    <select class="form-control form-control-sm" name="census_type" required>
                                        <option value="城镇">城镇</option>
                                        <option value="农村">农村</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <label class="input-group-text" for="">*婚姻状况</label>
                                    </div>
                                    <select class="form-control" name="marriage" id="">
                                        <option value="未婚">未婚</option>
                                        <option value="已婚">已婚</option>
                                        <option value="离异">离异</option>
                                        <option value="丧偶">丧偶</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <label class="input-group-text" for="">*手机</label>
                                        <input class="form-control form-control-sm" type="tel" name="mobile" id="" placeholder="">
                                    </div>
                                </div>
                            </div>
                            <div class="col">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <label class="input-group-text" for="">*邮箱</label>
                                        <input class="form-control form-control-sm" type="email" name="census" id="" placeholder="">
                                    </div>
                                </div>
                            </div>
                            <div class="col col-lg-4 col-xg-5">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <label for="" class="input-group-text">*出生日期</label>
                                    </div>
                                    <input type="date" class="form-control form-control-sm" name="birthday">
                                </div>
                            </div>
                            <div class="col">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <label for="" class="input-group-text">*生育情况</label>
                                    </div>
                                    <select class="form-control" name="birthstatus" id="">
                                        <option value="未婚">未婚</option>
                                        <option value="已婚">已婚</option>
                                        <option value="离异">离异</option>
                                        <option value="丧偶">丧偶</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <label class="input-group-text" for="">*身份证号</label>
                                    </div>
                                    <input type="text" name="identity" id="identity" class="form-control" placeholder="">
                                </div>
                            </div>
                            <div class="col">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <label for="" class="input-group-text">*身份证有效期限</label>
                                    </div>
                                    <input type="date" class="form-control" name="expiry_start">
                                    <input type="date" class="form-control" name="expiry_end">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col col-lg-2 avatar-box">
                        <img class="avatar" id="avatar" src="img/avatar.png" alt="">
                        <input id="avatar_input" type="file" accept="image/jpg,image/jpeg,image/png" />
                    </div>
                </div>
                <div class="row">
                    <div class="col">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*身份证住址</label>
                            </div>
                            <input type="text" class="form-control" name="identity_address">
                        </div>
                    </div>
                    <div class="col">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*现居住地址</label>
                            </div>
                            <input type="text" class="form-control" name="now_address">
                        </div>
                    </div>
                </div>
            </section>
            <section class="container container-fluid education-info">
                <div class="header">学历信息</div>
                <label for="" class="label">最高学历信息</label>
                <div class="form-group row">
                    <div class="col">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="col-form-label input-group-text">*学历</label>
                            </div>
                            <select class="form-control form-control-sm" name="edcation" id="">
                                <option value="博士">博士</option>
                                <option value="研究生">研究生</option>
                                <option value="本科">本科</option>
                                <option value="大专">大专</option>
                                <option value="高中">高中</option>
                                <option value="中专">中专</option>
                                <option value="初中及以下">初中及以下</option>
                            </select>
                        </div>
                    </div>
                    <div class="col">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*学位</label>
                            </div>
                            <select class="form-control form-control-sm" name="degree" id="">
                                <option value="博士">博士</option>
                                <option value="硕士">硕士</option>
                                <option value="学士">学士</option>
                                <option value="无">无</option>
                            </select>
                        </div>
                    </div>
                    <div class="col">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*毕业院校</label>
                            </div>
                            <input type="text" class="form-control" name="graduate_school">
                        </div>
                    </div>
                    <div class="col">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*专业</label>
                            </div>
                            <input type="text" class="form-control" name="major">
                        </div>
                    </div>
                    <div class="col">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*毕业时间</label>
                                <input class="form-control form-control-sm" type="date" name="graduation_time">
                            </div>
                        </div>
                    </div>
                </div>
                <label for="">最高学历信息</label>
                <div class="form-group row">
                    <div class="col table-responsive-sm">
                        <table class="table table-bordered table-sm">
                            <thead>
                                <tr>
                                    <td scope="col">起始时间</td>
                                    <td scope="col">毕业院校</td>
                                    <td scope="col">专业</td>
                                    <td scope="col">学历</td>
                                    <td scope="col">教育方式</td>
                                    <td scope="col">证书编号</td>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td scope="row">
                                        <div class="input-group">
                                            <div class="input-group-prepend">
                                                <input type="month" class="form-control form-control-sm" name="" id="" placeholder=""> ~
                                                <input type="month" class="form-control form-control-sm" name="" id="" placeholder="">
                                            </div>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="input-group">
                                            <input type="text" class="form-control" name="graduate_school">
                                        </div>
                                    </td>
                                    <td>
                                        <div class="input-group">
                                            <input type="text" class="form-control" name="major">
                                        </div>
                                    </td>
                                    <td>
                                        <div class="input-group">
                                            <select class="form-control form-control-sm" name="edcation" id="">
                                                <option value="博士">博士</option>
                                                <option value="研究生">研究生</option>
                                                <option value="本科">本科</option>
                                                <option value="大专">大专</option>
                                                <option value="高中">高中</option>
                                                <option value="中专">中专</option>
                                                <option value="初中及以下">初中及以下</option>
                                            </select>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="input-group">
                                            <select class="form-control form-control-sm" name="" id="">
                                                <option value="1">全日制</option>
                                                <option value="0">非全日制</option>
                                            </select>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="input-group">
                                            <input type="text" class="form-control" name="certificate">
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td scope="row">
                                        <div class="input-group">
                                            <div class="input-group-prepend">
                                                <input type="month" class="form-control form-control-sm" name="" id="" placeholder=""> ~
                                                <input type="month" class="form-control form-control-sm" name="" id="" placeholder="">
                                            </div>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="input-group">
                                            <input type="text" class="form-control" name="graduate_school">
                                        </div>
                                    </td>
                                    <td>
                                        <div class="input-group">
                                            <input type="text" class="form-control" name="major">
                                        </div>
                                    </td>
                                    <td>
                                        <div class="input-group">
                                            <select class="form-control form-control-sm" name="edcation" id="">
                                                <option value="博士">博士</option>
                                                <option value="研究生">研究生</option>
                                                <option value="本科">本科</option>
                                                <option value="大专">大专</option>
                                                <option value="高中">高中</option>
                                                <option value="中专">中专</option>
                                                <option value="初中及以下">初中及以下</option>
                                            </select>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="input-group">
                                            <select class="form-control form-control-sm" name="" id="">
                                                <option value="1">全日制</option>
                                                <option value="0">非全日制</option>
                                            </select>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="input-group">
                                            <input type="text" class="form-control" name="certificate">
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td scope="row">
                                        <div class="input-group">
                                            <div class="input-group-prepend">
                                                <input type="month" class="form-control form-control-sm" name="" id="" placeholder=""> ~
                                                <input type="month" class="form-control form-control-sm" name="" id="" placeholder="">
                                            </div>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="input-group">
                                            <input type="text" class="form-control" name="graduate_school">
                                        </div>
                                    </td>
                                    <td>
                                        <div class="input-group">
                                            <input type="text" class="form-control" name="major">
                                        </div>
                                    </td>
                                    <td>
                                        <div class="input-group">
                                            <select class="form-control form-control-sm" name="edcation" id="">
                                                <option value="博士">博士</option>
                                                <option value="研究生">研究生</option>
                                                <option value="本科">本科</option>
                                                <option value="大专">大专</option>
                                                <option value="高中">高中</option>
                                                <option value="中专">中专</option>
                                                <option value="初中及以下">初中及以下</option>
                                            </select>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="input-group">
                                            <select class="form-control form-control-sm" name="" id="">
                                                <option value="1">全日制</option>
                                                <option value="0">非全日制</option>
                                            </select>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="input-group">
                                            <input type="text" class="form-control" name="certificate">
                                        </div>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                <label class="label">其他技能</label>
                <div class="other-skill">

                    <div class="row">
                        <div class="col">
                            <div class="input-group input-group-sm">
                                <div class="input-group-prepend">
                                    <label for="" class="input-group-text black">专业技能</label>
                                </div>
                                <input type="text" class="form-control" name="identity_address">
                            </div>
                        </div>
                        <div class="col">
                            <div class="input-group input-group-sm">
                                <div class="input-group-prepend">
                                    <label for="" class="input-group-text black">个人证书</label>
                                </div>
                                <input type="text" class="form-control" name="now_address">
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            <div class="input-group input-group-sm">
                                <div class="input-group-prepend">
                                    <label for="" class="input-group-text black">外语水平</label>
                                </div>
                                <input type="text" class="form-control" name="identity_address">
                            </div>
                        </div>
                        <div class="col">
                            <div class="input-group input-group-sm">
                                <div class="input-group-prepend">
                                    <label for="" class="input-group-text black">其他技能</label>
                                </div>
                                <input type="text" class="form-control" name="now_address">
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <section class="container container-fluid contact-info">
                <div class="header">紧急联系人</div>
                <div class="row">
                    <div class="col">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*紧急联系人</label>
                            </div>
                            <input type="text" class="form-control form-control-sm" name="contact">
                        </div>
                    </div>
                    <div class="col">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*关系</label>
                            </div>
                            <input type="text" class="form-control" name="relation" placeholder="紧急联系人与本人的关系">
                        </div>
                    </div>
                    <div class="col">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*紧急电话</label>
                            </div>
                            <input type="text" class="form-control" name="contact_phone" placeholder="紧急联系人的电话">
                        </div>
                    </div>
                    <div class="col">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*地址</label>
                            </div>
                            <input type="text" class="form-control" name="contact_address" placeholder="紧急联系人的住址">
                        </div>
                    </div>
                </div>
            </section>
            <section class="container container-fluid member-info">
                <div class="header">家庭成员</div>
                <table class="table table-bordered table-sm">
                    <thead>
                        <tr>
                            <td>*姓名</td>
                            <td>*关系</td>
                            <td>*工作单位</td>
                            <td>*职务</td>
                            <td>*联系电话</td>
                            <td>*是否为紧急联系人</td>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td scope="row">
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="member1" id="" placeholder="">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <select class="form-control form-control-sm" name="relation1" id="">
                                        <option value="父亲">父亲</option>
                                        <option value="母亲">母亲</option>
                                        <option value="丈夫">丈夫</option>
                                        <option value="妻子">妻子</option>
                                        <option value="兄弟">兄弟</option>
                                        <option value="姐妹">姐妹</option>
                                        <option value="子女">子女</option>
                                        <option value="其它">其它</option>
                                    </select>
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="work_unit1">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="duty1">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="contact_phone1">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <select name="is_contact1" id="" class="form-control form-control-sm">
                                        <option value="1">是</option>
                                        <option value="0">否</option>
                                    </select>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td scope="row">
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="member2" id="" placeholder="">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <select class="form-control form-control-sm" name="relation2" id="">
                                        <option value="母亲">母亲</option>
                                        <option value="父亲">父亲</option>
                                        <option value="丈夫">丈夫</option>
                                        <option value="妻子">妻子</option>
                                        <option value="兄弟">兄弟</option>
                                        <option value="姐妹">姐妹</option>
                                        <option value="子女">子女</option>
                                        <option value="其它">其它</option>
                                    </select>
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="work_unit2">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="duty2">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="contact_phone2">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <select name="is_contact2" id="" class="form-control form-control-sm">
                                        <option value="1">是</option>
                                        <option value="0">否</option>
                                    </select>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td scope="row">
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="member3" id="" placeholder="">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <select class="form-control form-control-sm" name="relation3" id="">
                                        <option value="兄弟">兄弟</option>
                                        <option value="父亲">父亲</option>
                                        <option value="母亲">母亲</option>
                                        <option value="丈夫">丈夫</option>
                                        <option value="妻子">妻子</option>
                                        <option value="姐妹">姐妹</option>
                                        <option value="子女">子女</option>
                                        <option value="其它">其它</option>
                                    </select>
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="work_unit3">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="duty3">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="contact_phone3">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <select name="is_contact3" id="" class="form-control form-control-sm">
                                        <option value="1">是</option>
                                        <option value="0">否</option>
                                    </select>
                                </div>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </section>
            <section class="container container-fluid work-history">
                <div class="header">工作经历</div>
                <table class="table table-bordered table-sm">
                    <thead>
                        <tr>
                            <td>*起始时间</td>
                            <td>*工作单位</td>
                            <td>*担任职务</td>
                            <td>*离职原因</td>
                            <td>*证明人</td>
                            <td>*证明人联系电话</td>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td scope="row">
                                <div class="input-group">
                                    <div class="input-group-prepend">
                                        <input type="month" class="form-control form-control-sm" name="work_time_start_1" id="" placeholder=""> ~
                                        <input type="month" class="form-control form-control-sm" name="work_time_end_1" id="" placeholder="">
                                    </div>
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="work_unit_history1">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="duty_history1">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="reason1">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="certifier1">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="tel" class="form-control form-control-sm" name="certifier_phone1">
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td scope="row">
                                <div class="input-group">
                                    <div class="input-group-prepend">
                                        <input type="month" class="form-control form-control-sm" name="work_time_start_2" id="" placeholder=""> ~
                                        <input type="month" class="form-control form-control-sm" name="work_time_end_2" id="" placeholder="">
                                    </div>
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="work_unit_history2">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="duty_history2">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="reason2">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="certifier2">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="tel" class="form-control form-control-sm" name="certifier_phone2">
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td scope="row">
                                <div class="input-group">
                                    <div class="input-group-prepend">
                                        <input type="month" class="form-control form-control-sm" name="work_time_start_3" id="" placeholder=""> ~
                                        <input type="month" class="form-control form-control-sm" name="work_time_end_3" id="" placeholder="">
                                    </div>
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="work_unit_history3">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="duty_history3">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="reason3">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="text" class="form-control form-control-sm" name="certifier3">
                                </div>
                            </td>
                            <td>
                                <div class="input-group">
                                    <input type="tel" class="form-control form-control-sm" name="certifier_phone3">
                                </div>
                            </td>
                        </tr>

                    </tbody>
                </table>
            </section>
            <section class="container container-fluid entry-info">
                <div class="header">入职信息</div>
                <div class="row">
                    <div class="col">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*入职日期</label>
                            </div>
                            <input type="date" class="form-control form-control-sm" name="entry_date">
                        </div>
                    </div>
                    <div class="col">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*工号</label>
                            </div>
                            <input type="text" class="form-control form-control-sm" name="entry_number">
                        </div>
                    </div>
                    <div class="col">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*部门</label>
                            </div>
                            <input type="text" class="form-control form-control-sm" name="entry_department" placeholder="根据组织架构选择">
                        </div>
                    </div>
                    <div class="col">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*岗位</label>
                            </div>
                            <input type="date" class="form-control form-control-sm" name="entry_post" placeholder="根据组织架构选择">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col col-lg-3">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*试用期限</label>
                            </div>
                            <input type="text" class="form-control form-control-sm" name="probation_period" placeholder="X个月">
                        </div>
                    </div>
                    <div class="col col-lg-3">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*合同期限</label>
                            </div>
                            <input type="text" class="form-control form-control-sm" name="employment_period" placeholder="3年">
                        </div>
                    </div>
                    <div class="col col-lg-5">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*合同期限</label>
                            </div>
                            <input type="date" class="form-control form-control-sm" name="contract_date_start">
                            <input type="date" class="form-control form-control-sm" name="contract_date_end">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col col-lg-3">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*开户银行</label>
                            </div>
                            <input type="text" class="form-control form-control-sm" name="bank">
                        </div>
                    </div>
                    <div class="col col-lg-5">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*银行卡号</label>
                            </div>
                            <input type="text" class="form-control form-control-sm" name="bank_card">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col col-lg-3">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*是否有亲戚在我公司工作</label>
                            </div>
                            <select class="form-control form-control-sm" name="is_relative" id="">
                                <option value="1">是</option>
                                <option value="0">否</option>
                            </select>
                        </div>
                    </div>
                    <div class="col col-lg-3">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*姓名</label>
                            </div>
                            <input class="form-control form-control-sm" type="text" name="relative_name" id="" placeholder="是，则输入在公司的亲戚姓名">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col col-lg-3">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*能否出差</label>
                            </div>
                            <select class="form-control form-control-sm" name="is_evection" id="">
                                <option value="1">能</option>
                                <option value="0">否</option>
                            </select>
                        </div>
                    </div>
                    <div class="col col-lg-3">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*能否加班</label>
                            </div>
                            <select class="form-control form-control-sm" name="is_extra_work" id="">
                                <option value="1">能</option>
                                <option value="0">否</option>
                            </select>
                        </div>
                    </div>
                    <div class="col col-lg-3">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <label for="" class="input-group-text">*能否接受工作调动</label>
                            </div>
                            <select class="form-control form-control-sm" name="is_job_transfer" id="">
                                <option value="1">能</option>
                                <option value="0">否</option>
                            </select>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col d-flex justify-content-center">
                        <button type="submit" class="btn btn-cus-submit">提交</button>
                    </div>
                </div>
            </section>
        </form>
    </main>
    <script src="./js/jquery-1.12.4.min.js"></script>
    <script src="https://cdn.bootcss.com/jquery-validate/1.17.0/jquery.validate.min.js"></script>
    <script>
        var idCardNoUtil = {
            provinceAndCitys: {
                11: "北京",
                12: "天津",
                13: "河北",
                14: "山西",
                15: "内蒙古",
                21: "辽宁",
                22: "吉林",
                23: "黑龙江",
                31: "上海",
                32: "江苏",
                33: "浙江",
                34: "安徽",
                35: "福建",
                36: "江西",
                37: "山东",
                41: "河南",
                42: "湖北",
                43: "湖南",
                44: "广东",
                45: "广西",
                46: "海南",
                50: "重庆",
                51: "四川",
                52: "贵州",
                53: "云南",
                54: "西藏",
                61: "陕西",
                62: "甘肃",
                63: "青海",
                64: "宁夏",
                65: "新疆",
                71: "台湾",
                81: "香港",
                82: "澳门",
                91: "国外"
            },

            powers: ["7", "9", "10", "5", "8", "4", "2", "1", "6", "3", "7", "9", "10", "5", "8", "4", "2"],

            parityBit: ["1", "0", "X", "9", "8", "7", "6", "5", "4", "3", "2"],

            genders: {
                male: "男",
                female: "女"
            },

            checkAddressCode: function (addressCode) {
                var check = /^[1-9]\d{5}$/.test(addressCode);
                if (!check) return false;
                if (idCardNoUtil.provinceAndCitys[parseInt(addressCode.substring(0, 2))]) {
                    return true;
                } else {
                    return false;
                }
            },

            checkBirthDayCode: function (birDayCode) {
                var check = /^[1-9]\d{3}((0[1-9])|(1[0-2]))((0[1-9])|([1-2][0-9])|(3[0-1]))$/.test(birDayCode);
                if (!check) return false;
                var yyyy = parseInt(birDayCode.substring(0, 4), 10);
                var mm = parseInt(birDayCode.substring(4, 6), 10);
                var dd = parseInt(birDayCode.substring(6), 10);
                var xdata = new Date(yyyy, mm - 1, dd);
                if (xdata > new Date()) {
                    return false; //生日不能大于当前日期
                } else if ((xdata.getFullYear() == yyyy) && (xdata.getMonth() == mm - 1) && (xdata.getDate() ==
                        dd)) {
                    return true;
                } else {
                    return false;
                }
            },

            getParityBit: function (idCardNo) {
                var id17 = idCardNo.substring(0, 17);
                var power = 0;
                for (var i = 0; i < 17; i++) {
                    power += parseInt(id17.charAt(i), 10) * parseInt(idCardNoUtil.powers[i]);
                }
                var mod = power % 11;
                return idCardNoUtil.parityBit[mod];
            },

            checkParityBit: function (idCardNo) {
                var parityBit = idCardNo.charAt(17).toUpperCase();
                if (idCardNoUtil.getParityBit(idCardNo) == parityBit) {
                    return true;
                } else {
                    return false;
                }
            },

            checkIdCardNo: function (idCardNo) {
                //15位和18位身份证号码的基本校验
                var check = /^\d{15}|(\d{17}(\d|x|X))$/.test(idCardNo);
                if (!check) return false;

                //判断长度为15位或18位
                if (idCardNo.length == 15) {
                    return idCardNoUtil.check15IdCardNo(idCardNo);
                } else if (idCardNo.length == 18) {
                    return idCardNoUtil.check18IdCardNo(idCardNo);
                } else {
                    return false;
                }
            },

            //校验15位的身份证号码
            check15IdCardNo: function (idCardNo) {
                //15位身份证号码的基本校验
                var check = /^[1-9]\d{7}((0[1-9])|(1[0-2]))((0[1-9])|([1-2][0-9])|(3[0-1]))\d{3}$/.test(
                    idCardNo);
                if (!check) return false;
                //校验地址码
                var addressCode = idCardNo.substring(0, 6);
                check = idCardNoUtil.checkAddressCode(addressCode);
                if (!check) return false;
                var birDayCode = '19' + idCardNo.substring(6, 12);
                //校验日期码
                return idCardNoUtil.checkBirthDayCode(birDayCode);
            },

            //校验18位的身份证号码
            check18IdCardNo: function (idCardNo) {
                //18位身份证号码的基本格式校验
                var check =
                    /^[1-9]\d{5}[1-9]\d{3}((0[1-9])|(1[0-2]))((0[1-9])|([1-2][0-9])|(3[0-1]))\d{3}(\d|x|X)$/.test(
                        idCardNo);
                if (!check) return false;

                //校验地址码
                var addressCode = idCardNo.substring(0, 6);
                check = idCardNoUtil.checkAddressCode(addressCode);
                if (!check) return false;

                //校验日期码
                var birDayCode = idCardNo.substring(6, 14);
                check = idCardNoUtil.checkBirthDayCode(birDayCode);
                if (!check) return false;

                //验证校检码
                return idCardNoUtil.checkParityBit(idCardNo);
            },
            formateDateCN: function (day) {
                var yyyy = day.substring(0, 4);
                var mm = day.substring(4, 6);
                var dd = day.substring(6);
                return yyyy + '-' + mm + '-' + dd;
            },
            //获取信息
            getIdCardInfo: function (idCardNo) {
                var idCardInfo = {
                    gender: "", //性别
                    birthday: "" // 出生日期(yyyy-mm-dd)
                };
                if (idCardNo.length == 15) {
                    var aday = '19' + idCardNo.substring(6, 12);

                    idCardInfo.birthday = idCardNoUtil.formateDateCN(aday);

                    if (parseInt(idCardNo.charAt(14)) % 2 == 0) {
                        idCardInfo.gender = idCardNoUtil.genders.female;
                    } else {
                        idCardInfo.gender = idCardNoUtil.genders.male;
                    }
                } else if (idCardNo.length == 18) {
                    var aday = idCardNo.substring(6, 14);

                    idCardInfo.birthday = idCardNoUtil.formateDateCN(aday);

                    if (parseInt(idCardNo.charAt(16)) % 2 == 0) {
                        idCardInfo.gender = idCardNoUtil.genders.female;
                    } else {
                        idCardInfo.gender = idCardNoUtil.genders.male;
                    }
                }
                return idCardInfo;
            },

            getId15: function (idCardNo) {
                if (idCardNo.length == 15) {
                    return idCardNo;
                } else if (idCardNo.length == 18) {
                    return idCardNo.substring(0, 6) + idCardNo.substring(8, 17);
                } else {
                    return null;
                }
            },

            getId18: function (idCardNo) {
                if (idCardNo.length == 15) {
                    var id17 = idCardNo.substring(0, 6) + '19' + idCardNo.substring(6);
                    var parityBit = idCardNoUtil.getParityBit(id17);
                    return id17 + parityBit;
                } else if (idCardNo.length == 18) {
                    return idCardNo;
                } else {
                    return null;
                }
            }
        };

        //验证护照是否正确
        function checknumber(number) {
            var str = number;
            //在JavaScript中，正则表达式只能使用"/"开头和结束，不能使用双引号
            var Expression = /(P\d{7})|(G\d{8})/;
            var objExp = new RegExp(Expression);

            if (objExp.test(str) == true) {
                return true;
            } else {
                return false;
            }
        };

        (function (factory) {
            if (typeof define === "function" && define.amd) {
                define(["jquery", "../jquery.validate"], factory);
            } else {
                factory(jQuery);
            }
        }(function ($) {
            /*
             * Translated default messages for the jQuery validation plugin.
             * Locale: ZH (Chinese, 中文 (Zhōngwén), 汉语, 漢語)
             */
            $.extend($.validator.messages, {
                required: "必填",
                remote: "请修正此字段",
                email: "请输入有效的电子邮件地址",
                url: "请输入有效的网址",
                date: "请输入有效的日期",
                dateISO: "请输入有效的日期 (YYYY-MM-DD)",
                number: "请输入有效的数字",
                digits: "只能输入数字",
                creditcard: "请输入有效的信用卡号码",
                equalTo: "你的输入不相同",
                extension: "请输入有效的后缀",
                maxlength: $.validator.format("最多可以输入 {0} 个字符"),
                minlength: $.validator.format("最少要输入 {0} 个字符"),
                rangelength: $.validator.format("请输入长度在 {0} 到 {1} 之间的字符串"),
                range: $.validator.format("请输入范围在 {0} 到 {1} 之间的数值"),
                max: $.validator.format("请输入不大于 {0} 的数值"),
                min: $.validator.format("请输入不小于 {0} 的数值")
            });
        }));

        // 身份证号码验证 
        jQuery.validator.addMethod("isIdCardNo", function (value, element) {
            return this.optional(element) || idCardNoUtil.checkIdCardNo(value);
        }, "请输入正确的身份证号码");

        // 手机号码验证 
        jQuery.validator.addMethod("isMobile", function (value, element) {
            var length = value.length;
            var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;
            return this.optional(element) || (length == 11 && mobile.test(value));
        }, "请输入正确的手机号码");

        // 电话号码验证 
        jQuery.validator.addMethod("isTel", function (value, element) {
            var tel = /^\d{3,4}-?\d{7,9}$/; //电话号码格式010-12345678 
            return this.optional(element) || (tel.test(value));
        }, "请输入正确的电话号码");

        // 联系电话(手机/电话皆可)验证 
        jQuery.validator.addMethod("isPhone", function (value, element) {
            var length = value.length;
            var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;
            var tel = /^\d{3,4}-?\d{7,9}$/;
            return this.optional(element) || (tel.test(value) || mobile.test(value));
        }, "请输入正确的联系电话");

        // 邮政编码验证 
        jQuery.validator.addMethod("isZipCode", function (value, element) {
            var tel = /^[0-9]{6}$/;
            return this.optional(element) || (tel.test(value));
        }, "请输入正确的邮政编码");
        
        // 结束时间不能早于开始时间
        jQuery.validator.addMethod("compareDate",function(value, element, param) {
            var startDate = jQuery(param).val();
            
            var date1 = new Date(Date.parse(startDate.replace("-", "/")));
            var date2 = new Date(Date.parse(value.replace("-", "/")));
            return date1 < date2;
        }, "结束时间不能早于开始时间");

        $.validator.setDefaults({
            submitHandler: function () {
                console.log("提交事件!");
            }
        });
        $().ready(function () {
            $("#entryform").validate({
                // TODO：只验证不提交表单 测试完删掉
                debug: true,
                rules: {
                    employee_name: "required",
                    gender: "required",
                    national: {
                        required: true
                    },
                    political: "required",
                    native_place: "required",
                    census: "required",
                    census_type: "required",
                    marriage: "required",
                    mobile: "required",
                    birthday: "required",
                    birthstatus: "required",
                    identity: {
                        required: true,
                        isIdCardNo: true
                    },
                    expiry_start: "required",
                    expiry_end: {
                        required: true,
                        compareDate: "#expiry_start"
                    },
                    identity_address: "required",
                    now_address: "required",
                    edcation: "required",
                    degree: "required",
                    graduate_school: "required",
                    major: "required",
                    graduation_time: "required",
                    contact: "required",
                    relation: "required",
                    contact_phone: {
                        required: true,
                        isPhone: true
                    },
                    contact_address: "required",
                    member1: "required",
                    relation1: "required",
                    work_unit1: "required",
                    duty1: "required",
                    contact_phone1: "required",
                    is_contact1: "required",
                    work_time_start_1: "required",
                    work_time_end_1: "required",
                    work_unit_history1: "required",
                    duty_history1: "required",
                    reason1: "required",
                    certifier1: {
                        required: true,
                        isPhone: true
                    },
                    certifier_phone1: "required",
                    entry_date: "required",
                    entry_number: "required",
                    entry_department: "required",
                    entry_post: "required",
                    probation_period: {
                        required: true,
                        digits: true
                    },
                    employment_period: {
                        required: true,
                        digits: true
                    },
                    contract_date_start: "required",
                    contract_date_end: "required",
                    bank_card: {
                        required: true,
                        creditcard: true
                    },
                    is_relative: "required",
                    is_evection: "required",
                    is_extra_work: "required",
                    is_job_transfer: "required",

                    username: {
                        required: true,
                        minlength: 2
                    },
                    password: {
                        required: true,
                        minlength: 5
                    },
                    confirm_password: {
                        required: true,
                        minlength: 5,
                        equalTo: "#password"
                    },
                    email: {
                        required: true,
                        email: true
                    },
                    topic: {
                        required: "#newsletter:checked",
                        minlength: 2
                    },
                    agree: "required"
                },
                messages: {
                    national: {
                        required: "必选"
                    }
                }
            });
            
        });

        // 检测是否支持File API
        if (window.File && window.FileReader && window.FileList && window.Blob) {
            //  支持
            // 上传头像
            $('#avatar_input').on('change', function (e) {
                // 获取图片资源
                var file = e.target.files[0];

                // 只选择图片
                if (!file.type.match('image.*')) {
                    return false;
                }

                var reader = new FileReader();

                // 读取文件
                reader.readAsDataURL(file);

                // 渲染文件
                reader.onload = function (arg) {
                    var imgsrc = arg.target.result
                    $('#avatar').empty().attr('src', imgsrc);
                }

                // 上传到服务器
                var form_data = new FormData();
                var file_data = $('#avatar_input').prop('files')[0];
                // 把上传的数据放入form_data
                form_data.append('img', file_data);

                $.ajax({
                    url: "",
                    type: "POST",
                    dataType: "json",
                    crossDomain: true,
                    processData: false,
                    contentType: false,
                    data: form_data,
                }).done(function (res) {
                    console.log(res);
                }).fail(function (err) {
                    console.log('上传图片失败', err);
                })
            })
        } else {
            alert('不支持H5 File API，请换谷歌浏览器');
        }
    </script>
</body>

</html>